import echarts from 'echarts'
const install = function(Vue) {
  Object.defineProperties(Vue.prototype, {
    $chart: {
      get() {
        return {
          //画一条简单的线
          line1: function (id) {
            this.chart = echarts.init(document.getElementById(id));
            this.chart.clear();

            const optionData = {

              tooltip : {
                trigger: 'axis',
                formatter: function(params) {
                  console.log(params)
                  params[0].color='#6D6EFA'
                  params[1].color='#CB6ACB'
                  params[2].color='#25BE8A'
                  params[3].color='#408CFF'
                  params[4].color='#FCA35E'
                  params[5].color='#3EC4FC'
                  params[6].color='#FEC943'
                  params[0].marker='<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#6D6EFA;"></span>'
                  params[1].marker='<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#CB6ACB;"></span>'
                  params[2].marker='<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#25BE8A;"></span>'
                  params[3].marker='<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#408CFF;"></span>'
                  params[4].marker='<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#FCA35E;"></span>'
                  params[5].marker='<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#3EC4FC;"></span>'
                  params[6].marker='<span style="display:inline-block;margin-right:5px;border-radius:10px;width:10px;height:10px;background-color:#FEC943;"></span>'
                  var result = '时间：'+params[0].axisValue+'<br/>'
                  params.forEach(function (item) {
                    // console.log(item)
                    result += item.marker+item.seriesName+'数量 ：' + item.data +'<br/>'
                  })
                  return result
                }
              },
              grid: {
                left: '50px',
                right: '20px',
                top: '20px',
                bottom: '20px'
              },
              // legend: {
                // data:['点击','收藏','入库','登录','评价',"应用",'注册']
              // },
              // toolbox: {
              //   feature: {
              //     saveAsImage: {}
              //   }
              // },
              xAxis: {
                boundaryGap: false,
                type: 'category',
                data: ['1:00', '3:00', '5:00', '7:00', '9:00', '11：00', '13：00','15:00', '17:00', '19:00', '21:00', '23:00']
              },
              yAxis: {
                type: 'value'
              },
              series: [
                {
                data: [90, 932, 901, 934, 1290, 1330, 1320,820, 932, 901, 934, 1290],
                name:"点击",
                type: 'line',
                smooth: false,
                  lineStyle:{
                    color:"#6D6EFA",
                  }
              },

                {
                  data: [1190, 732, 501, 634, 1090, 1730, 620,720, 222, 701, 634, 990],
                  name:"收藏",
                  type: 'line',
                  smooth: false,
                  lineStyle:{
                    color:"#CB6ACB",
                  }
                },
                {
                  data: [900, 532, 701, 834, 290, 1330, 1120,620, 902, 901, 434, 1190],
                  name:"入库",
                  type: 'line',
                  smooth: false,
                  lineStyle:{
                    color:"#25BE8A",
                  }
                },
                {
                  data: [200, 555, 666, 222, 777, 666, 777,456, 222, 854, 758, 1000],
                  name:"登录",
                  type: 'line',
                  smooth: false,
                  lineStyle:{
                    color:"#408CFF",
                  }
                },
                {
                  data: [400, 758, 689, 453, 875, 456, 726,111, 444, 758, 456, 453],
                  name:"评价",
                  type: 'line',
                  smooth: false,
                  lineStyle:{
                    color:"#FCA35E",
                  }
                },
                {
                  data: [800, 555, 888, 999, 1090, 1730, 123,777, 899, 456, 777, 587],
                  name:"应用",
                  type: 'line',
                  smooth: false,
                  lineStyle:{
                    color:"#3EC4FC",
                  }
                },
                {
                  data: [1190, 732, 759, 444, 123, 456, 111,785, 456, 222, 888, 222],
                  name:"注册",
                  type: 'line',
                  smooth: false,
                  lineStyle:{
                    color:"#FEC943",
                  }
                },
              ]

            };


            this.chart.setOption(optionData);

          },

        }
      }
    }
  })
}

export default {
  install
}
